﻿function Pollutant(container, config) {
    this.timepoints = [];
    this.SO2 = [];
    this.NO2 = [];
    this.NO = [];
    this.CO = [];
    this.O3 = [];
    this.O3_8H = [];
    this.PM25 = [];
    this.PM10 = [];
    this.AQI = [];
    this.AQILevel = [];
    this.AQIAvg = [];
    this.AQIType = [];
    this.AQIAvgType = [];
    this.PrimarryPollutant = [];
    this.PriPol = [];
    this.Mark = [];
    this.height = config["height"] || null;
    this.width = config["width"] || null;
    this.xwidth = config["xwidth"] || null;
    this.subTitle = config["subTitle"] || null;
    this.station = config["station"] || "";
    this.container = container;
}

Pollutant.prototype.tooltipFormatter = function (tooltip) {
    var index = tooltip.points[1].point.x, ret = '<middle>' + tooltip.x + '</middle><br>',
        point = tooltip.points[1].point,
        series = tooltip.points[1].series;

    ret += ('<tr><td colspan="5"><span style="color:' + series.color + '">\u25CF</span><strong>' + series.name +
            ': ' + Highcharts.pick(point.value, point.y) + "&nbsp;&nbsp;" + this.AQIType[index] + '</strong></td></tr>' +
            '<tr><td  colspan="5">首要污染物: ' + pollutantNameSubTransform(this.PrimarryPollutant[index]) + '</td></tr>' +

          '<tr><td width="55px" align="right">SO<sub>2</sub>:</td><td width="35px" class="color-blue"> ' + this.SO2[index] + '</td><td class="tdwidth" width="10px">&nbsp;</td><td width="55px" align="right">CO:</td><td width="35px" class="color-blue"> ' + this.CO[index] + '</td></tr>' +
          '<tr><td align="right">NO<sub>2</sub>:</td><td class="color-blue"> ' + this.NO2[index] + '</td><td class="tdwidth">&nbsp;</td><td align="right">NO:</td><td class="color-blue"> ' + this.NO[index] + '</td></tr>' +
          '<tr><td align="right">PM<sub>2.5</sub>:</td><td class="color-blue"> ' + this.PM25[index] + '</td><td class="tdwidth">&nbsp;</td><td align="right">PM<sub>10</sub>:</td><td class="color-blue"> ' + this.PM10[index] + '</td></tr>');
          

    if (this.O3_8H.length == 0) {
        ret += '<tr><td align="right">O<sub>3</sub>:</td><td colspan="4" class="color-blue"> ' + this.O3[index] + '</td></tr>';
    }
    else {
        ret += '<tr><td align="right" >O<sub>3</sub>:</td><td class="color-blue"> ' + this.O3[index] + '</td><td class="tdwidth">&nbsp;</td><td align="right">O<sub>3</sub>_8H:</td><td class="color-blue"> ' + this.O3_8H[index] + '</td></tr>';
    }



    point = tooltip.points[0].point;
    series = tooltip.points[0].series;
    ret = '<table class="table_tooltip"><tr><td colspan="5"><span style="color:' + series.color + '">\u25CF</span><strong>' + series.name +
               ': ' + Highcharts.pick(point.value, point.y) + "&nbsp;&nbsp;" + this.AQIAvgType[index] + '</strong></td></tr>' + ret;
    ret += '</table>';
    return ret;
};

Pollutant.prototype.getStep = function () {
    var _ = this,
        width = $("#" + _.container).width(),
        count = _.timepoints.length,
        num = 1,
        xWidth = _.xwidth;
    while (xWidth * count > width) {
        num = num * 2;
        count = count / 2;
    }
    return num;
}

Pollutant.prototype.getChartOptions = function () {
    var pollutant = this;
    return {
        chart: {
            renderTo: pollutant.container,
            height: pollutant.height,
            width: pollutant.width
        },
        credits: {
            enabled: false
        },
        title: {
            text: pollutant.subTitle + pollutant.station + 'AQI趋势图'
        },
        xAxis: [{
            categories: pollutant.timepoints,
            tickInterval: pollutant.getStep()
        }],
        yAxis: { // temperature axis
            title: {
                text: null
            },
            labels: {
                style: {
                    fontSize: '10px'
                }
            },
            plotLines: [{
                value: 50,
                color: '#00FF00',
                width: 3,
                label: {
                    text: '一级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 100,
                color: '#FFFF00',
                width: 3,
                label: {
                    text: '二级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 150,
                color: '#FF7E00',
                width: 3,
                label: {
                    text: '三级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 200,
                color: '#FF0000',
                width: 3,
                label: {
                    text: '四级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }, {
                value: 300,
                color: '#99004C',
                width: 3,
                label: {
                    text: '五级',
                    align: 'left',
                    style: {
                        color: 'gray'
                    }
                }
            }]
        },
        tooltip: {
            crosshairs: true,
            useHTML: true,
            shared: true,
            formatter: function () {
                return pollutant.tooltipFormatter(this);
            }
        },
        series: [{
            name: '城市AQI值',
            type: 'spline',
            data: pollutant.AQIAvg
        }, {
            name: '站点AQI值',
            type: 'spline',
            data: pollutant.AQI
        }]
    }
};

Pollutant.prototype.onChartLoad = function (chart) {
    if ($("#dataTable").length > 0) {
        $("#dataTable").show();
    }
};

Pollutant.prototype.createChart = function () {
    var pollutant = this;
    this.chart = new Highcharts.Chart(pollutant.getChartOptions(), function (chart) {
        pollutant.onChartLoad(chart);
    });
};

Pollutant.prototype.initData = function (config) {
    var pol = this, _ = config;

    if (typeof (_["O3_8HStr"]) != "undefined") {
        var O3_8HArr = _["O3_8HStr"].split(',');
        $.each(O3_8HArr, function (index, value) {
            pol.O3_8H.push(parseFloat(value));
        });
    }

    var timepointDataArr = _["cateStr"].split(','),
        SO2Arr = _["SO2Str"].split(','),
        NO2Arr = _["NO2Str"].split(','),
        NOArr = _["NOStr"].split(','),
        COArr = _["COStr"].split(','),
        O3Arr = _["O3Str"].split(','),
        PM25Arr = _["PM25Str"].split(','),
        PM10Arr = _["PM10Str"].split(','),
        AQIArr = _["AQIStr"].split(','),
        AQIAvgArr = _["AQIAvgStr"].split(',');
    pol.AQILevel = _["AQILevelStr"].split(',');
    pol.PrimarryPollutant = _["PrimarryPollutantStr"].split('|');
    pol.AQIType = _["AQITypeStr"].split(',');
    pol.AQIAvgType = _["AQIAvgTypeStr"].split(',');

    $.each(timepointDataArr, function (index, value) {
        pol.timepoints.push(value);
    });

    $.each(SO2Arr, function (index, value) {
        pol.SO2.push(parseFloat(value));
    });

    $.each(NO2Arr, function (index, value) {
        pol.NO2.push(parseFloat(value));
    });

    $.each(NOArr, function (index, value) {
        pol.NO.push(parseFloat(value));
    });

    $.each(COArr, function (index, value) {
        pol.CO.push(parseFloat(value));
    });

    $.each(O3Arr, function (index, value) {
        pol.O3.push(parseFloat(value));
    });

    $.each(PM25Arr, function (index, value) {
        pol.PM25.push(parseFloat(value));
    });

    $.each(PM10Arr, function (index, value) {
        pol.PM10.push(parseFloat(value));
    });

    $.each(AQIArr, function (index, value) {
        pol.AQI.push(parseFloat(value));
    });

    $.each(AQIAvgArr, function (index, value) {
        pol.AQIAvg.push(parseFloat(value));
    });

    pol.createChart();
};

Pollutant.prototype.getMaxMin = function (chart) {
    var result = {}, temp;
    result.max = -99;
    result.min = 999;
    Highcharts.each(chart.series, function (series) {
        temp = series.yData.max();
        if (result.max < temp) {
            result.max = temp;
        }
        temp = series.yData.min();
        if (result.min > temp) {
            result.min = temp;
        }
    });
    return result;
}

Array.prototype.max = function () {
    return Math.max.apply({}, this);
}
Array.prototype.min = function () {
    return Math.min.apply({}, this);
}

Pollutant.prototype.getMaxMinLevel = function (maxMinVal) {
    var result = {};
    result.maxLevel = this.getAQILevel(maxMinVal.max);
    result.minLevel = this.getAQILevel(maxMinVal.min);
    return result;
}

Pollutant.prototype.getAQILevel = function (airIndex) {
    var level = -1;
    if (airIndex < 0)
        return 1;
    else if (airIndex > 300)
        return 6;
    switch (Math.floor(airIndex / 50)) {
        case 0: level = 1; break;
        case 1: level = 2; break;
        case 2: level = 3; break;
        case 3: level = 4; break;
        case 4: level = 5; break;
        case 5: level = 6; break;
        default: break;
    }
    return level;
}

Pollutant.prototype.getAQILevelInfo = function () {
    var level = [{ level: 1, value: 50, color: "#00FF00" }, { level: 2, value: 100, color: "#FFFF00" },
    { level: 3, value: 150, color: "#FF7E00" }, { level: 4, value: 200, color: "#FF0000" },
    { level: 5, value: 250, color: "#99004C" }, { level: 6, value: 300, color: "#7E0023" }];
    return level;
}

Pollutant.prototype.drawAQILine = function (chart) {
    var maxMin = this.getMaxMinLevel(this.getMaxMin(chart)),
        levelInfo = this.getAQILevelInfo(), curLvl;
    count = chart.xAxis[0].max + 1;
    for (var i = maxMin.minLevel; i < maxMin.maxLevel; i++) {
        curLvl = $.grep(levelInfo, function (v) {
            return v.level === i;
        })[0];
        if (curLvl) {
            var temp = [], data = curLvl.value;
            for (var j = 0; j < count; j++) {
                temp.push(data);
            }
            chart.addSeries({
                name: "AQI等级标准线",
                data: temp,
                color: curLvl.color,
                type: "line",
                dashStyle: 'LongDash'
            });
        }
    }
}
